<template>
  <div>
    <!-- <Header /> -->

    <Address/>
    <div class="main_box w">
      <div class="main_left">
<!--        <div class="cont_list">-->
<!--          <el-table-->
<!--            :data="tableData"-->
<!--            style="width: 100%">-->
<!--            <el-table-column prop="companyName"></el-table-column>-->
<!--          </el-table>-->
<!--        </div>-->
        <div v-for="info in tableData">
          <span><strong>{{info.companyName}}</strong></span>
          <el-divider/>
          地址：<span>{{info.address}}</span>
          <el-divider/>
          联系人：<span>{{info.linkman}}</span>
          <el-divider/>
          电话：<span>{{info.phonecall}}</span>
          <el-divider/>
          邮箱：<span>{{info.email}}</span>
          <el-divider/>
          手机号：<span>{{info.cellphone}}</span>
          <el-divider/>
          网站：<span>{{info.website}}</span>
          <el-divider/>
          微信号：<span>{{info.weChat}}</span>


        </div>
      </div>
      <dataCent/>
    </div>
    <!-- <Footer /> -->
  </div>
</template>

<script>
    // import Header from "@/components/header";
    import Footer from "@/components/footer";
    import Address from "@/components/address";
    import dataCent from "@/components/dataCent";
    import request from "@/plugins/request";
    import {api} from "@/plugins/api/index";

    export default {
        components: {
            // Header,
            Address,
            Footer,
            dataCent
        },
        data() {
            return {
                // menu_id: "2",
                // currentPage: 1,
                // pageSize: 10,
                // total: 13,
                // title: "",
                tableData: [],
            };
        },
        mounted() {
            this.getAboutInfo();
        },
        methods:{
            //获取关于我们信息
            getAboutInfo(){
                request(api.aboutInfo,{},"get").then((res)=>{
                    this.tableData = res;
                })
            }
        }
    };
</script>

<style lang="scss" scoped>
  @import "~/assets/css/main.scss";

  .service {
    height: 100%;
    // position: relative;

    .address {
      margin: rem(10) auto;
      display: flex;
      align-items: center;
      font-size: rem(14);

      &_text {
        margin-right: rem(5);
      }

      ::v-deep .el-breadcrumb__inner {
        font-size: rem(14) !important;
      }
    }

    .main_box {
      //   position: ;
      display: flex;
      margin-bottom: rem(30);

      .main_left {
        padding: rem(20);
        flex: 1;
        color: #666;

        /*.cont_list {*/
        /*  min-height: rem(526);*/

        /*  ::v-deep .el-table {*/
        /*    .el-table__row {*/
        /*      cursor: pointer;*/

        /*      &:hover {*/
        /*        color: #5cbcfe;*/
        /*      }*/
        /*    }*/

        /*  }*/
        /*}*/
      }

      .main_right {
        width: rem(200);
        background-color: #f6f9fc;

        .list_item {
          .title {
            display: flex;
            height: rem(40);
            color: #337ab7;
            font-size: rem(18);
            border-bottom: 2px solid #e7edf2;
            margin: 0 rem(10);

            .more {
              font-size: rem(10);
            }
          }

          .cont {
            margin: 0 rem(10);

            .item {
              padding: rem(5) rem(5);
              border-bottom: 1px dotted #e4e6e8;
              cursor: pointer;

              i {
                margin: 0 rem(3);
              }

              &:hover {
                color: #5cb6ff;
              }
            }
          }
        }
      }
    }
  }
  /* el-divider 修改高度&虚线效果 */
  .el-divider--horizontal{
    margin: 8px 0;
    background: 0 0;
    border-top: 2px dashed #e8eaec;
  }

  // .footer {
  //   position: absolute;
  //   left: 0;
  //   right: 0;
  //   bottom: 0;
  // }
</style>
